<link rel="stylesheet" href="../src/css/pages/abTest.css">
<div class="fmp-container">
    <div class="abTest-container">
        <div class="query">
            <div class="query-block">
                <span style="display:inline-block;float:left;margin-right:10px;font-size:14px;" class="scope-label">{{i18n-reportScope}}</span>
                <div class="query-item" style="width: 200px;">
                    <select name="select-website" style="width: 100%;"></select>
                </div>
                <div class="query-item">
                    <select name="select-feed" style="width: 100%;"></select>
                </div>
                <div class="query-item">
                    <select name="compare-dimension" style="width: 100%;"></select>
                </div>
                <div class="query-item">
                    <input type="hidden" name="timeRange-since">
                    <input type="hidden" name="timeRange-until">
                    <div class="timeRange-range date-range">
                    </div>
                </div>
                <button type="button" class="btn font-icon font-icon-conf filter-icon disabled" title="{{i18n-backgroundDimension}}"></button>
            </div>

            <div class="query-btn-area">
                 <div class="query-result-area">
                 </div>
                <div>
                    <button type="button" class="btn btn-primary btn-query btn-85-30">{{i18n-queryBtn}}</button>
                </div>
            </div>
        </div>
        <!--<div class="row filters" style="margin-top: 20px;" name="filters">-->

        <!--</div>-->
        <div class="filter-condition-container hide">
            <div class="filter-block audienceManager-block">
                <span class="filter-title">{{i18n-audienceTemplateColon}}</span>
                <div class="filter-item select2-c" key="audienceTemplate">
                    <select name="audienceManager" class="audience" style="width:100%" placeholder="{{i18n-audienceTemplate}}"></select>
                </div>
            </div>
            <div class="filter-block productSet-block">
                <span class="filter-title">{{i18n-productSetColon}}</span>
                <div class="filter-item select2-c" key="productSet">
                    <select name="productSet" class="product-set" style="width:100%" placeholder="{{i18n-productSet}}"></select>
                </div>
            </div>
            <div class="filter-block ecTemplateMateriel-block">
                <span class="filter-title">{{i18n-creativeTemplateColon}}</span>
                <div class="filter-item select2-c" key="creativeTemplate">
                    <select name="ecTemplateMateriel" class="materiel-template" style="width:100%" placeholder="{{i18n-creativeTemplate}}"></select>
                </div>
            </div>
            <div class="filter-block placement-block">
                <span class="filter-title">{{i18n-placementColon}}</span>
                <div class="filter-item" key="placement">
                </div>
            </div>
            <div class="filter-block optimizationGoal-block">
                <span class="filter-title">{{i18n-optimizationGoalColon}}</span>
                <div class="filter-item" key="optimizationGoal">
                </div>
            </div>
            <div class="filter-block billingEvent-block">
                <span class="filter-title">{{i18n-billingEventColon}}</span>
                <div class="filter-item" key="billingEvent">
                </div>
            </div>
            <div class="filter-block bid-block">
                <span class="filter-title">{{i18n-bidColon}}</span>
                <div class="filter-item" key="bid">
                </div>
            </div>
            <div class="filter-footer">

                <button type="button" class="btn btn-primary btn-85-30 filter-ok-btn">{{i18n-confirm}}</button>
                <button type="button" class="btn btn-outline btn-85-30 filter-cancel-btn">{{i18n-cancel}}</button>
            </div>
        </div>

        <div class="search-result-area">
            <div class="table-container hide">
                <span class="block-title"><i class="font-icon font-icon-line block-icon"></i>{{i18n-dataReport}}</span>
                <div class="no-result">
                    {{i18n-noResults}}
                </div>
                <div class="table-content">
                    <div class="table-summary btn-group" role="group" aria-label="...">
                        <button type="button" value="-1" class="btn btn-default table-summary-single">{{i18n-total}}</button>
                        <button type="button" value="1" class="btn btn-default table-summary-single">{{i18n-byDay}}</button>
                    </div>
                    <div id="adTest-table">
                    </div>
                </div>
            </div>

            <div class="graph-container hide">
                <span class="block-title"><i class="font-icon font-icon-pie block-icon"></i>{{i18n-graphicalReport}}</span>
                <div class="no-result">
                    {{i18n-noResults}}
                </div>
                <div class="graph-blocks">
                    <div class="graph-block">
                        <!-- 同一纬度不同指标对比 -->
                        <div class="left-graph">
                            <span class="graph-title"></span>
                            <div class="graph-dimension-change">
                             <span>
                                {{i18n-indicatorC}}
                            </span>
                                <div class="dropdown drop2-wrapper" name="indicators">

                                </div>
                            </div>
                            <div class="indicator-bar-comparison" id="indicator-bar-comparison">

                            </div>

                        </div>
                        <!-- 同一纬度百分比对比 -->
                        <div class="right-graph">
                            <span class="graph-title" style="margin-bottom:0px;"></span>
                            <div class="indicator-line-comparison">

                            </div>
                        </div>

                    </div>
                    <div class="graph-block">

                        <!-- 同一纬度的不同指标对比 -->
                        <div class="left-graph">
                            <span class="graph-title"></span>
                            <div class="graph-dimension-change">
                            <span class="dimension-label">
                                版位：
                            </span>
                                <div class="dropdown drop2-wrapper" name="dimensions">

                                </div>
                            </div>
                            <div class="dimension-comparison" id="dimension-comparison">

                            </div>
                        </div>
                        <!-- 同一纬度百分比对比 -->
                        <div class="right-graph">
                            <span class="graph-title">{{i18n-performanceAnalysis}}</span>
                            <div class="radar-graph" id="radar-graph">

                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

    </div>
</div>

<script type="text/x-template" id="indicator-line-comparison-t">
    <div class="line-single" >
        <span class="line-single-label"><%=keyLabel%></span>
        <div class="line-single-graph" id="<%=key%>_line">

        </div>
    </div>


</script>
